{% comment %}theme-check-disable UndefinedObject{% endcomment %}
{{ 'section-footer.css' | asset_url | stylesheet_tag }}
<link rel="stylesheet" href="{{ 'component-newsletter.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-list-menu.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-list-payment.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-list-social.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'component-rte.css' | asset_url }}" media="print" onload="this.media='all'">
<link rel="stylesheet" href="{{ 'disclosure.css' | asset_url }}" media="print" onload="this.media='all'">

<noscript>{{ 'component-newsletter.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-list-menu.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-list-payment.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-list-social.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'component-rte.css' | asset_url | stylesheet_tag }}</noscript>
<noscript>{{ 'disclosure.css' | asset_url | stylesheet_tag }}</noscript>

<footer class="footer tenways-footer color-{{ section.settings.color_scheme }} gradient" >
  {%- if section.blocks.size > 0 or section.settings.newsletter_enable or section.settings.show_social -%}
    <div class="footer__content-top page-width">
      {%- if section.blocks.size > 0 -%}
        {%- liquid
          if section.blocks.size == 9
            assign footer_grid_class = 'grid--3-col-tablet'
          elsif section.blocks.size > 6
            assign footer_grid_class = 'grid--4-col-desktop'
          elsif section.blocks.size > 4
            assign footer_grid_class = 'grid--3-col-tablet'
          endif
        -%}
        <div class="footer__blocks-wrapper grid grid--1-col grid--2-col grid--4-col-tablet {{ footer_grid_class }}">
          {%- for block in section.blocks -%}
            <div class="footer-block grid__item{% if block.type == 'link_list' and block.settings.heading != blank %} footer-block--menu{% endif %}  {% if block.type == 'text' %} footer-block--text{% endif %}" {{ block.shopify_attributes }}>
              {%- if block.settings.heading != blank -%}
                <h2 class="footer-block__heading">{{- block.settings.heading | escape -}}</h2> 
               {% if block.type == 'link_list' and block.settings.heading != blank %}
                 <span class="footer-down">{% render 'footer-down' %}  </span>
                 {% endif %}
              {%- endif -%}

              {%- case block.type -%}
                {%- when 'text' -%}
                  <div class="footer-block__details-content rte">
                    {{ block.settings.subtext }}
                    {%- if section.settings.newsletter_enable -%}
                    <div class="footer-block__newsletter">
                      {%- if section.settings.newsletter_heading != blank -%}
                        <h2 class="footer-block__heading">{{ section.settings.newsletter_heading | escape }}</h2>
                      {%- endif -%}
                      {%- form 'customer', id: 'ContactFooter', class: 'footer__newsletter newsletter-form' -%}
                        <input type="hidden" name="contact[tags]" value="newsletter">
                        <div class="newsletter-form__field-wrapper footer-block_nesletter">
                          <div class="field">
                            <input
                              id="NewsletterForm--{{ section.id }}"
                              type="email"
                              name="contact[email]"
                              class="field__input"
                              value="{{ form.email }}"
                              aria-required="true"
                              autocorrect="off"
                              autocapitalize="off"
                              autocomplete="email"
                              {% if form.errors %}
                                autofocus
                                aria-invalid="true"
                                aria-describedby="ContactFooter-error"
                              {% elsif form.posted_successfully? %}
                                aria-describedby="ContactFooter-success"
                              {% endif %}
                              placeholder="{{ 'newsletter.label' | t }}"
                              required
                            >
                            <label class="field__label" for="NewsletterForm--{{ section.id }}">
                              name@email.com
                            </label>
                            <button type="submit" class="bg-hover tenways-footer_sub newsletter-form__button field__button" name="commit" id="Subscribe" aria-label="{{ 'newsletter.button_label' | t }}">
                              <span>  {{ 'newsletter.button_label' | t }} </span>
                            </button>
                          </div>
                          {%- if form.errors -%}
                            <small class="newsletter-form__message form__message" id="ContactFooter-error">{% render 'icon-error' %}{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}! and You have to agree to the privacy policy to subscribe.</small>
                          {%- endif -%}

                          <div class="field checkbox-policy">                         
                            <div class="checkbox">
                                <input id="checkbox_policy" type="checkbox" 
                                       name="contact[checkbox]"  
                                        {%- if form.errors contains 'checkbox' -%}
                                        autofocus
                                aria-invalid="true"
                                aria-describedby="ContactFooter-error"
                                       2
                                       {%- endif -%}
                                       avalue="privacy policy" 
                                       required/> 
                                <label for="checkbox_policy">{{ section.settings.privacy_policy }}</label>
                            </div>
                        </div>
                          


                        </div>
                        {%- if form.posted_successfully? -%}
                          <h3 class="newsletter-form__message newsletter-form__message--success form__message" 
                            id="ContactFooter-success" tabindex="-1" autofocus>{% render 'icon-success' %}   
                            {%- if block.settings.discount != blank -%}
                            {{ block.settings.discount }}
                            {%- endif -%}
                          </h3>
                          <!-- {%- if block.settings.discount != blank -%}
                          <div class="actives_newsletter">
                               {{ block.settings.discount }}
                          </div>
                          {%- endif -%} -->
                        {%- endif -%}
                      {%- endform -%}
                    </div>
                  {%- endif -%}



                  {%- if section.settings.show_social -%}
                 <div class="mobile">
                  <ul class="footer__list-social list-unstyled list-social" role="list">
                    {%- if settings.social_twitter_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_twitter_link }}" class="link list-social__link" >
                          {%- render 'icon-twitter' -%}
                          <span class="visually-hidden">{{ 'general.social.links.twitter' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_facebook_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_facebook_link }}" class="link list-social__link" >
                          {%- render 'icon-facebook' -%}
                          <span class="visually-hidden">{{ 'general.social.links.facebook' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_pinterest_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_pinterest_link }}" class="link list-social__link" >
                          {%- render 'icon-pinterest' -%}
                          <span class="visually-hidden">{{ 'general.social.links.pinterest' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_instagram_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_instagram_link }}" class="link list-social__link" >
                          {%- render 'icon-instagram' -%}
                          <span class="visually-hidden">{{ 'general.social.links.instagram' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_tiktok_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_tiktok_link }}" class="link list-social__link" >
                          {%- render 'icon-tiktok' -%}
                          <span class="visually-hidden">{{ 'general.social.links.tiktok' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_tumblr_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_tumblr_link }}" class="link list-social__link" >
                          {%- render 'icon-tumblr' -%}
                          <span class="visually-hidden">{{ 'general.social.links.tumblr' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_snapchat_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_snapchat_link }}" class="link list-social__link" >
                          {%- render 'icon-snapchat' -%}
                          <span class="visually-hidden">{{ 'general.social.links.snapchat' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_youtube_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_youtube_link }}" class="link list-social__link" >
                          {%- render 'icon-youtube' -%}
                          <span class="visually-hidden">{{ 'general.social.links.youtube' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                    {%- if settings.social_vimeo_link != blank -%}
                      <li class="list-social__item">
                        <a href="{{ settings.social_vimeo_link }}" class="link list-social__link" >
                          {%- render 'icon-vimeo' -%}
                          <span class="visually-hidden">{{ 'general.social.links.vimeo' | t }}</span>
                        </a>
                      </li>
                    {%- endif -%}
                  </ul>
                 </div>
                {%- endif -%}
                  </div>
                {%- when 'link_list' -%}
                  {%- if block.settings.menu != blank and block.settings.heading != blank -%}
                    <ul class="footer-block__details-content list-unstyled">
                      {%- for link in block.settings.menu.links -%}
                        <li>
                          <a href="{{ link.url }}" class="move-hover link link--text list-menu__item list-menu__item--link{% if link.active %} list-menu__item--active{% endif %}">
                            {{ link.title }}
                          </a>
                        </li>
                      {%- endfor -%}
                  
                    </ul>
                  {%- endif -%}
                {%- when 'image' -%}
                  <div class="footer-block__details-content footer-block-image {{ block.settings.alignment }}">
                    {%- if block.settings.image != blank -%}
                      {%- assign image_size = block.settings.image_width | append: 'x' -%}
                      <img
                        srcset= "{{ block.settings.image | img_url: image_size }}, {{ block.settings.image | img_url: image_size, scale: 2 }} 2x"
                        src="{{ block.settings.image | img_url: '400x' }}"
                        alt="{{ block.settings.image.alt | escape }}"
                        loading="lazy"
                        width="{{ block.settings.image.width }}"
                        height="{{ block.settings.image.height }}"
                        style="max-width: min(100%, {{ block.settings.image_width }}px);"
                      >
                    {%- else -%}
                      {{ 'image' | placeholder_svg_tag: 'placeholder-svg placeholder' }}
                    {%- endif -%}
                  </div>
                {%- endcase -%}
            </div>
          {%- endfor -%}
        </div>
      {%- endif -%}

      <div class="footer-block--newsletter pc">
        {%- if section.settings.show_social -%}
          <ul class="footer__list-social list-unstyled list-social" role="list">
            {%- if settings.social_twitter_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_twitter_link }}" class="link list-social__link" >
                  {%- render 'icon-twitter' -%}
                  <span class="visually-hidden">{{ 'general.social.links.twitter' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_facebook_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_facebook_link }}" class="link list-social__link" >
                  {%- render 'icon-facebook' -%}
                  <span class="visually-hidden">{{ 'general.social.links.facebook' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_pinterest_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_pinterest_link }}" class="link list-social__link" >
                  {%- render 'icon-pinterest' -%}
                  <span class="visually-hidden">{{ 'general.social.links.pinterest' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_instagram_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_instagram_link }}" class="link list-social__link" >
                  {%- render 'icon-instagram' -%}
                  <span class="visually-hidden">{{ 'general.social.links.instagram' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_tiktok_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_tiktok_link }}" class="link list-social__link" >
                  {%- render 'icon-tiktok' -%}
                  <span class="visually-hidden">{{ 'general.social.links.tiktok' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_tumblr_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_tumblr_link }}" class="link list-social__link" >
                  {%- render 'icon-tumblr' -%}
                  <span class="visually-hidden">{{ 'general.social.links.tumblr' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_snapchat_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_snapchat_link }}" class="link list-social__link" >
                  {%- render 'icon-snapchat' -%}
                  <span class="visually-hidden">{{ 'general.social.links.snapchat' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_youtube_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_youtube_link }}" class="link list-social__link" >
                  {%- render 'icon-youtube' -%}
                  <span class="visually-hidden">{{ 'general.social.links.youtube' | t }}</span>
                </a>
              </li>
            {%- endif -%}
            {%- if settings.social_vimeo_link != blank -%}
              <li class="list-social__item">
                <a href="{{ settings.social_vimeo_link }}" class="link list-social__link" >
                  {%- render 'icon-vimeo' -%}
                  <span class="visually-hidden">{{ 'general.social.links.vimeo' | t }}</span>
                </a>
              </li>
            {%- endif -%}
          </ul>
        {%- endif -%}
      </div>
    </div>
  {%- endif -%}

  <div class="footer__content-bottom">
    <div class="footer__content-bottom-wrapper page-width">
      <div class="footer_column footer-plicy">
        {%- if section.settings.menu != blank -%}
          <ul class="footer-block__details-content list-unstyled">
             <li class="li_s li li-footer location-pc">
              {% render 'localization' %}
            </li>
            {%- for link in section.settings.menu.links -%}

              <li>
                <a href="{{ link.url }}" class="move-hover link link--text list-menu__item list-menu__item--link{% if link.active %} list-menu__item--active{% endif %}">
                  {{ link.title }}
                </a>
              </li>
            {%- endfor -%}
          </ul>
        {%- endif -%}
      </div>
      <div class="footer__column footer__column--info">
        {%- if section.settings.payment_enable -%}
          <div class="footer__payment">
            <span class="visually-hidden">{{ 'sections.footer.payment' | t }}</span>
            <ul class="list list-payment" role="list">
              {%- for type in shop.enabled_payment_types -%}
                <li class="list-payment__item">
                  {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
                </li>
              {%- endfor -%}
              {% assign IsoCode = section.settings.iso_code | split: ',' %}
              {% if IsoCode contains localization.country.iso_code %}
                <li class="list-payment__item">
                  {% render 'icon-klaran' %}
              </li>
              {% endif %}
            </ul>
          </div>
        {%- endif -%}
        <div class="footer__copyright caption">
          <small class="copyright__content">&copy; {{ 'now' | date: "%Y" }}, {{ shop.name | link_to: routes.root_url }}</small>
        </div>
      </div>
    </div>
  </div>
</footer>



{% javascript %}
  class LocalizationForm extends HTMLElement {
    constructor() {
      super();
      this.elements = {
        input: this.querySelector('input[name="locale_code"], input[name="country_code"]'),
        button: this.querySelector('button'),
        panel: this.querySelector('ul'),
      };
      this.elements.button.addEventListener('click', this.openSelector.bind(this));
      this.elements.button.addEventListener('focusout', this.closeSelector.bind(this));
      this.addEventListener('keyup', this.onContainerKeyUp.bind(this));

      this.querySelectorAll('a').forEach(item => item.addEventListener('click', this.onItemClick.bind(this)));
    }

    hidePanel() {
      this.elements.button.setAttribute('aria-expanded', 'false');
      this.elements.panel.setAttribute('hidden', true);
    }

    onContainerKeyUp(event) {
      if (event.code.toUpperCase() !== 'ESCAPE') return;

      this.hidePanel();
      this.elements.button.focus();
    }

    onItemClick(event) {
      event.preventDefault();
      const form = this.querySelector('form');
      this.elements.input.value = event.currentTarget.dataset.value;
      if (form) form.submit();
    }

    openSelector() {
      this.elements.button.focus();
      this.elements.panel.toggleAttribute('hidden');
      this.elements.button.setAttribute('aria-expanded', (this.elements.button.getAttribute('aria-expanded') === 'false').toString());
    }

    closeSelector(event) {
      const shouldClose = event.relatedTarget && event.relatedTarget.nodeName === 'BUTTON';
      if (event.relatedTarget === null || shouldClose) {
        this.hidePanel();
      }
    }
  }

  customElements.define('localization-form', LocalizationForm);
{% endjavascript %}

{% schema %}
{
  "name": "t:sections.footer.name",
  "blocks": [
    {
      "type": "link_list",
      "name": "t:sections.footer.blocks.link_list.name",
      "settings": [
        {
          "type": "text",
          "id": "heading",
          "default": "Quick links",
          "label": "t:sections.footer.blocks.link_list.settings.heading.label",
          "info": "t:sections.footer.blocks.link_list.settings.heading.info"
        },
        {
          "type": "link_list",
          "id": "menu",
          "default": "footer",
          "label": "t:sections.footer.blocks.link_list.settings.menu.label",
          "info": "t:sections.footer.blocks.link_list.settings.menu.info"
        }
      ]
    },
    {
      "type": "text",
      "name": "t:sections.footer.blocks.text.name",
      "settings": [
        {
          "type": "text",
          "id": "heading",
          "default": "Heading",
          "label": "t:sections.footer.blocks.text.settings.heading.label"
        },
        {
          "type": "richtext",
          "id": "subtext",
          "default": "<p>Share store details, promotions, or brand content with your customers.</p>",
          "label": "t:sections.footer.blocks.text.settings.subtext.label"
        },
        {
          "type": "richtext",
          "id": "discount",
          "label": "Discount"
        }
      ]
    },
    {
      "type": "image",
      "name": "Image",
      "settings": [
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image"
        },
        {
          "type": "range",
          "id": "image_width",
          "min": 50,
          "max": 200,
          "step": 5,
          "unit": "px",
          "label": "Image width",
          "default": 100
        },
        {
          "type": "select",
          "id": "alignment",
          "label": "Image alignment on large screen",
          "options": [
            {
              "value": "",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        }
      ]
    }
  ],
  "settings": [
    {
      "type": "select",
      "id": "color_scheme",
      "options": [
        {
          "value": "accent-1",
          "label": "t:sections.footer.settings.color_scheme.options__1.label"
        },
        {
          "value": "accent-2",
          "label": "t:sections.footer.settings.color_scheme.options__2.label"
        },
        {
          "value": "background-1",
          "label": "t:sections.footer.settings.color_scheme.options__3.label"
        },
        {
          "value": "background-2",
          "label": "t:sections.footer.settings.color_scheme.options__4.label"
        },
        {
          "value": "inverse",
          "label": "t:sections.footer.settings.color_scheme.options__5.label"
        }
      ],
      "default": "background-1",
      "label": "t:sections.footer.settings.color_scheme.label"
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header__1.content",
      "info": "t:sections.footer.settings.header__1.info"
    },
    {
      "type": "checkbox",
      "id": "newsletter_enable",
      "default": true,
      "label": "t:sections.footer.settings.newsletter_enable.label"
    },
    {
      "type": "text",
      "id": "newsletter_heading",
      "default": "Subscribe to our emails",
      "label": "t:sections.footer.settings.newsletter_heading.label"
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header__2.content",
      "info": "t:sections.footer.settings.header__2.info"
    },
    {
      "type": "checkbox",
      "id": "show_social",
      "default": false,
      "label": "t:sections.footer.settings.show_social.label"
    },
    {
      "type": "text",
      "id": "button_label",
      "default": "Button label",
      "label": "Button label"
    },
    {
      "type": "url",
      "id": "button_link",
      "label": "button_link"
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header__3.content",
      "info": "t:sections.footer.settings.header__4.info"
    },
    {
      "type": "checkbox",
      "id": "enable_country_selector",
      "default": true,
      "label": "t:sections.footer.settings.enable_country_selector.label"
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header__5.content",
      "info": "t:sections.footer.settings.header__6.info"
    },
    {
      "type": "checkbox",
      "id": "enable_language_selector",
      "default": true,
      "label": "t:sections.footer.settings.enable_language_selector.label"
    },
    {
      "type": "header",
      "content": "t:sections.footer.settings.header__7.content"
    },
    {
      "type": "link_list",
      "id": "menu",
      "default": "main-menu",
      "label": "Footer menu"
    },
    {
      "type": "html",
      "id": "iso_code",
      "default": "IE,ES,BE,AT,DE,FR,IT,NL",
      "label": "Iso code"
    },
    {
      "type": "checkbox",
      "id": "payment_enable",
      "default": true,
      "label": "t:sections.footer.settings.payment_enable.label"
    },
    {
      "type": "richtext",
      "id": "privacy_policy",
      "label": "Privacy Policy"
    }
  ],
  "default": {
    "blocks": [
      {
        "type": "link_list"
      },
      {
        "type": "text"
      }
    ]
  }
}
{% endschema %}
